<template>
  <div style="background-color:#ebeeea; ">
  <div style="width: 60%;margin-left: 20%;background-color: white">
    <div style="height: 400px;width: 100%">
      <div style="width: 50%;height: 300px;float: left;">
        <img :src="this.photoUrl" style="width: 300px;height: 300px;margin-left: 25%">
      </div>
      <div style="width: 50%;height: 300px;float: left">
        <div  style="width: 400px;height:300px" >
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px" >项目名：   {{projectName}}</p>
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px">项目属性：  {{ lable}}</p>
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px">报价：  {{price}}</p>
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px">工期：  {{timeLimit}}</p>
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px" v-if="this.style===0">外包形式：项目外包</p>
          <p  style="width: 400px;word-wrap: break-word;height: 25px;line-height: 10px" v-if="this.style===1">外包形式：人员内招</p>
          <p  style="width: 400px;word-wrap: break-word;height: 300px;line-height: 20px" > 简介:   {{introduce}} <a :href=this.projectDoc ><p>点我下载项目详细文档</p></a>    </p>
        </div>
        <!--<p style="white-space: pre-wrap;">简介：{{introduce}}</p>-->
      </div>
    </div>
    <div style="width: 100%;height: 40px;background-color:#ebeeea"></div>

    <div style="width: 100%">
      <span style="height: 60px;weight:100%;margin-bottom: 40px;"><p style="font-style: normal;font-size: large;">申请工作室展示</p></span>
      <el-table :data="tableData1" style="width: 100%;margin-top: 30px" height="250">
        <el-table-column prop="workroomId" label="工作室编号" width="180"></el-table-column>
        <el-table-column prop="workroomName" label="工作室名" width="180"></el-table-column>
        <el-table-column prop="price" label="报价"></el-table-column>
        <el-table-column prop="timeLimit" label="预定项目完成日期"></el-table-column>
        <el-table-column prop="sx" label="申请组织性质"></el-table-column>
        <el-table-column prop="sw" label="评分"></el-table-column>
      </el-table>
    </div>

    <div style="width: 100%;height: 40px;background-color:#ebeeea"></div>

    <div style="width: 100%;">
      <span style="height: 60px;weight:100%;margin-bottom: 40px;"><p style="font-style: normal;font-size: large;">工作室联盟</p></span>
      <el-row style="margin-top:0px;">
        <el-col :span="5" v-for="table in teamData" :key="o" :offset="index > 0 ?1: 1" style="margin-top: 30px ;height:350px">
          <el-card :body-style="{ padding: '0px' }" shadow="hover"  >
            <div @click="jumpp(table.id)">
              <img :src="table.photo" class="image" style="height: 300px">
              <div style="padding: 0px;border: 0px ;line-height: 60px;text-align: center "  >
                <p style="line-height: 0px">{{table.tname}}</p>
              </div>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>

    <div style="margin-top: 40px">
    <span v-if="this.ff" style="margin-top: 80px;margin-left: 40%">
      <el-button  v-if="this.style===0" type="success" round @click="jump('ProjectApply')" >申请</el-button>
      <el-button  v-if="this.style===0" type="success" round @click="jumppp()" >创建队伍</el-button>
      <el-button  v-if="this.style===1" type="success" round @click="jumpppp('ProjectPApply')" >申请</el-button>
    </span>
  </div>
</div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        ff:'',
        id:'',
        projectName:'',
        lable:'',
        introduce:'',
        photoUrl:'',
        price:'',
        projectDoc:'',
        timeLimit:'',
        style:'',
        tableData1: [
          { id:'',
            workroomId:'',
            workroomName:'',
            price:'',
            timeLimit:'',
            sx:'',
            sw:'',
          }
        ],
        teamData:[]
      }
    },
    mounted: function () {
      this.id= this.$route.query.mallCode
      axios.post('/user/findProjectById',{
        id: this.id,
        states: this.id
      }).then((response) => {
        if(response.data!=""){
          console.log("fff")

          var user= JSON.parse(window.sessionStorage.getItem("user"));
          if(user!=null&user!=""){
            var jj=user.role
            if(jj.includes("workroom")){
              this.ff=true

            }
          }




          var e=response.data
          console.log(e)
          this.projectName=e.projectName

          this.lable=e.lable

          this.price=e.price

          this.style=e.style

          this.introduce=e.introduce
          this.projectDoc=e.projectDoc
          this.photoUrl=e.photoUrl
          console.log("bbbbb")
          var a=e.timeLimit
          var b= a.split("T")
          this.timeLimit=b[0]





        }
        else{
          // this.$notify.error({
          //   title: '项目未被找到',
          //   message: response.data.message,
          //   type: 'warning',
          //   duration:0
          // });
          }

      }).catch((response)=>{
        this.$notify.error({
          title: '',
          message: '错误'
        });
      })


      axios.post('/user/findApplyProject',{
        id: this.id,
        pid: this.id
      }).then((response) => {
        if(response.data!=""){

          var a=100
          var ee=response.data
          console.log(ee)
          var data=[];
          for(var c=0;c<ee.length;c++){
             var eee=ee[c]

            var obj={}
            obj.workroomId=eee.wid
            obj.workroomName=eee.projectName
            obj.price=eee.price
            var aa=eee.timeLimit
            var bb= aa.split("T")
            // Math.ceil(Math.random()*10);      // 获取从1到10的随机整数 ，取0的概率极小。
           var f= this.sum(1,70)
            console.log(f)

            var ff=f/10
            console.log(ff)


             a=a-ff;

            obj. sw=a
            obj. timeLimit=bb[0]
            if(eee.tid==0){

              obj.sx="工作室"
            }
            else{
              obj.sx="工作室联盟"
            }

            data[c]=obj
          }
          this. tableData1=data




          // this.projectName=e.projectName
          // this.lable=e.lable
          // this.price=e.price
          // this.introduce=e.introduce
          // this.projectDoc=e.projectDoc
          // this.photoUrl=e.photoUrl
          // var a=e.timeLimit
          // var b= a.split("T")
          // this.timeLimit=b[0]
          //







        }
        else{
          this.$notify.error({
            title: '没有人申请该项目',
            message: response.data.message,
            type: 'warning',
            duration:0
          });}

      }).catch((response)=>{
        this.$notify.error({
          title: '',
          message: '错误'
        });
      })



      axios.post('/user/selectTeamByPid',{
        pid: this.id,
        states: this.id
      }).then((response) => {
        if(response.data!=""){


          let ee=response.data

          this.teamData=ee


          console.log(this.teamData)
          // var user= JSON.parse(window.sessionStorage.getItem("user"));
          // var jj=user.role
          //
          // if(jj.includes("workroom")){
          //   this.ff=true
          //
          // }
          // var e=response.data
          // this.projectName=e.projectName
          // this.lable=e.lable
          // this.price=e.price
          // this.style=e.style
          // this.introduce=e.introduce
          // this.projectDoc=e.projectDoc
          // this.photoUrl=e.photoUrl
          // var a=e.timeLimit
          // var b= a.split("T")
          // this.timeLimit=b[0]





        }
        else{
          // this.$notify.error({
          //   title: '项目未被找到',
          //   message: response.data.message,
          //   type: 'warning',
          //   duration:0
          // });
        }

      }).catch((response)=>{
        this.$notify.error({
          title: '',
          message: '错误'
        });
      })





    },
    methods: {

     sum (m,n){
    var num = Math.floor(Math.random()*(m - n) + n);
    return num
  },


      jump(path){

        this.$router.push({
          path: '/ProjectApply',
          query: {
            mallCode: this.id

          }
        })

      },
      jumpppp(path){

        this.$router.push({
          path: '/ProjectPApply',
          query: {
            mallCode: path

          }
        })

      },
      jumpp(path){

        this.$router.push({
          path: '/TeamInfo',
          query: {
            mallCode: path

          }
        })

      },



      jumppp(path){
        var user= JSON.parse(window.sessionStorage.getItem("user"));
        var wid=user.id
        this.$router.push({
          path: '/TeamBuild',
          query: {
            pid: this.id,
            wid:wid

          }
        })

      },



    }
  }
</script>

<style scoped>

  .image {
    width: 100%;
    display: block;
  }

</style>
